<template>
  <el-header class="header" style="height: 40px">
    <span class="welcome_wrap">
      <span class="welcomeInfo">
        <i class="el-icon-star-off"></i>
        <span>欢迎您登录电信产品订购与入库系统</span>
      </span>
      <span class="loginInfo">
        <span
          v-show="this.$route.path === '/' && loginStatus === null"
          @click="toLoginDialog"
          class="login_wrap"
        >
          <span><i class="el-icon-user"></i> </span>
          <span>登 录</span>
        </span>

        <span v-show="getUserInfoFromSS !== null" class="login_wrap" @click="logOut">
          <span> <i class="el-icon-phone-outline"></i> </span>
          <span> 注 销</span>
        </span>
      </span>
    </span>
  </el-header>
</template>
<script>
import baseMixin from "../mixin/baseMixin";
export default {
  mixins: [baseMixin],
  emits: ["setDialogFormVisible"],
  data() {
    return {
      loginStatus: {},
    };
  },
  methods: {
    toLoginDialog() {
      // 通过父组件来改变对话框显示状态
      this.$emit("setDialogFormVisible", true);
    },
  },
  created() {
    this.loginStatus = sessionStorage.getItem("userInfo");
  },
  watch: {
    loginStatus: {
      immediate: true,
      handler(val) {
        this.loginStatus = val;
      },
    },
  },
};
</script>

<style lang="scss">
@import "../assets/css/global.scss";
</style>